{% set _pageRoute = '/_mder' %}
{# {% set _container = 'container-fuild' %} #}

{% extends "_layouts/default.twig" %}

{% block body %}
  <div class="btn-group btn-group-sm" role="group" aria-label="...">
    <a href="{{ path_for('mder-manager',{'action':'source'}) }}" type="button" class="btn {{ _globals.page.action == 'source' ? 'btn-primary' : 'btn-default' }}">Sources Files</a>
    <a href="{{ path_for('mder-manager',{'action':'blog'}) }}" type="button" class="btn {{ _globals.page.action == 'blog' ? 'btn-primary' : 'btn-default' }}">Blog Articles</a>
    <a href="#" type="button" class="btn {{ _globals.page.action == 'setting' ? 'btn-primary' : 'btn-default' }}">Site Setting</a>
  </div>
  <hr>
    <div class="panel panel-default">
      <!-- Default panel contents -->
      <div class="panel-heading">
        <a href="{{ path_for('mder-page',{'action':'add'}, {'page':'/blog'}) }}" class="btn btn-primary btn-xs pull-right">
            <span class="glyphicon glyphicon-plus"></span> {{ _globals.lang.createBlog }}
        </a>
        <h3 class="panel-title">Panel heading
        </h3>
      </div>
      <div class="panel-body">
        <p>...</p>
      </div>

      <!-- Table -->
      <table class="table table-hover">
        <thead>
          <tr>
            <th>#ID</th>
            <th>Status</th>
            <th>Title</th>
            <th>Author </th>
            <th>Publish Time</th>
            <th>Create Time</th>
            <th>Route</th>
            <th>Operate</th>
          </tr>
        </thead>
        <tbody>

        {% for article in articles %}
          <tr>
            <th scope="row">{{ article.id }}</th>
            <td><span class="label label-info">{{ statusList[article.status] }}</span></td>
            <td>{{ article.title }}</td>
            <td>{{ article.authorId}}</td>
            <td>{{ article.publishTime|date('Y.m.d H:i') }}</td>
            <td>{{ article.createTime|date('Y.m.d H:i') }}</td>
            <td>{{ article.route }}</td>
            <td>
              <div class="btn-group btn-group-xs" role="group" aria-label="...">
                <a role="button" href="{{ article.route }}" class="btn btn-success"><span class="glyphicon glyphicon-eye-open"></span></a>
                {# <button type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span></button> #}
                <button type="button" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span></button>

                <div class="btn-group btn-group-xs" role="group">
                  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {# &hellip; #}
                    <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu">
                    <li><a href="#">Dropdown link</a></li>
                    <li><a href="#">Dropdown link</a></li>
                  </ul>
                </div>
              </div>
            </td>
          </tr>
        {% endfor %}

        </tbody>
      </table>

    </div>
      <nav>
        <ul class="pagination">
          <li>
            <a href="#" aria-label="Previous">
              <span aria-hidden="true">&laquo;</span>
            </a>
          </li>
          <li><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
          <li><a href="#">5</a></li>
          <li>
            <a href="#" aria-label="Next">
              <span aria-hidden="true">&raquo;</span>
            </a>
          </li>
        </ul>
      </nav>
{% endblock %}